{% extends "base.html" %}

{% block content %}
  {% from "macros/forms.html" import form_input_content, form_switch %}
  <script type="text/javascript">
  if (typeof htmx !== 'undefined' && htmx.onLoad) {
    htmx.onLoad(function (elt) {
      initChoices('trending-tag-filter-select', 'tags');
    });
  } else {
    initChoices('trending-tag-filter-select', 'tags');
  }
  </script>

  <div class="p-8 bg-base-100" id="edit_dashboard">
    <div class="text-3xl font-bold mb-4">Edit Dashboard</div>
    <form method="post" action="{{ url_for('base.dashboard') }}">
      <div class="mb-4">
        <div class="flex gap-2">
          <fieldset class="fieldset bg-base-100 flex-none w-1/8">
            <legend class="fieldset-legend">Days to look back for trending clusters</legend>
            {{ form_input_content(label="Trending Days", name="dashboard[trending_cluster_days]",
                        value=dashboard.trending_cluster_days , type='number') }}
          </fieldset>

          {{ form_switch(label="Show Trending Clusters", name="dashboard[show_trending_clusters]", value=dashboard.show_trending_clusters, yes_val=true, no_val=false, required=False, width='w-1/8') }}

          {{ form_switch(label="Show Charts in Dashboard", name="dashboard[show_charts]", value=dashboard.show_charts, yes_val=true, no_val=false, required=False, width='w-1/8') }}

        </div>

        <div class="flex-none w-2/8">
          <select name="dashboard[trending_cluster_filter][]" multiple id="trending-tag-filter-select">
            {% for cluster in clusters %}
              <option value="{{ cluster.name }}" {% if cluster.name in dashboard.trending_cluster_filter %}selected{% endif %}>{{ cluster.name }}</option>
            {% endfor %}
          </select>
        </div>

        <input type="hidden" name="csrf_token" value="{{ request.cookies.get('csrf_access_token', '') }}">
        <input type="submit" class="btn btn-primary w-2/4 mt-4" value="Update Dashboard Settings" />
      </div>
    </form>
  </div>
{% endblock content %}
